<template>
    <ul>
      <!-- 方法1 class-->
      <li v-for="item in list" :class="{'active': $index === activeId}" :key="item.id">{{item}}</li>

      <!-- 方法2 style-->
      <li v-for="item in list" :style="{backgroundColor: $index == activeId ? 'red' : '#564'}" :key="item.id">{{item}}</li>
    </ul>
</template>

<script>

export default {
  name:"login",
  data () {
        return {
          list: ['a', 'b', 'c'],
          activeId: 0
        }
    }
}
    
</script>
<style>
.active{
  color: red;
}

</style>
